<template>
    <div class="box">
        <van-nav-bar title="订单列表" />
        <van-tabs v-model:active="active">
            <van-tab title="全部">
                <van-card v-for="(v, i) in list1" :key="i" num="2" :price="v.goods_price" :title="v.goods_name"
                    thumb="">
                    <template #thumb>
                        <lazy-component>
                            <img :src="goods_big_logo ? goods_big_logo : 'http://image1.suning.cn/uimg/b2c/newcatentries/0000000000-000000000601395527_1_400x400.jpg'"
                                alt="" style="width: 6rem;
                        height: 6rem;">
                        </lazy-component>

                    </template>
                    <template #footer>
                        <van-button size="mini">取消订单</van-button>
                        <van-button size="mini" @click="orderFun">立即支付</van-button>
                    </template>
                </van-card>
            </van-tab>
            <van-tab title="待支付">内容 2</van-tab>
            <van-tab title="待评价">内容 3</van-tab>
            <van-tab title="待收货">内容 4</van-tab>
        </van-tabs>
    </div>
</template>

<script setup>
import { ref } from 'vue'
import { getOrderListApi, searchApi } from '@/api/api';
import { useRoute, useRouter } from 'vue-router'

const router = useRouter()
const route = useRoute()

let list = ref([])

const getOrder = () => {
    getOrderListApi().then(res => {
        if (res.data.code == 0) {
            list.value = res.data.data
        }
    })
}
getOrder()

let list1 = ref({})
const searchs = () => {
    searchApi().then(res => {
        list1.value = res.data.message.goods
    })
}
searchs()

const orderFun = () => {
    router.push('/order')
}

</script>

<style lang="scss" scoped></style>